<template>
<div class="page-container">
    <div class="toolbar">
        <el-row>
            <el-tabs type="border-card">
                <el-tab-pane label="单据信息">
                    <el-form :inline="true" :model="operateDataForm" label-width="110px" ref="operateDataForm" :rules="operateDataFormRules" class="form">
                        <el-row style="margin-top: 0px;" class="search-input">
                            <el-form-item label="虚拟仓库编码：" prop="code">
                                <el-input v-model="operateDataForm.code" clearable placeholder="请输入" :disabled="!flag"></el-input>
                            </el-form-item>
                            <el-form-item label="虚拟仓库名称：" prop="name">
                                <el-input v-model="operateDataForm.name" clearable placeholder="请输入" :disabled="!flag"></el-input>
                            </el-form-item>
                            <el-form-item label="商家：" prop="deptId">
                                <el-select v-model="operateDataForm.deptId" :disabled="!flag">
                                    <el-option v-for="item in selectedOptionsData1" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                            <!-- <el-form-item label="备注">
                  <el-input v-model="operateDataForm.code" placeholder="请输入"></el-input>
                </el-form-item>-->
                        </el-row>
                    </el-form>
                </el-tab-pane>
                <el-row class="search-button s-button">
                    <el-button-group>
                        <el-button type="primary" size="small" @click="addOperate()" :disabled="operateDataForm.id!=0">选择区域</el-button>
                    </el-button-group>
                </el-row>
            </el-tabs>
        </el-row>
        <el-row>
            <el-tabs type="border-card">
                <!--仓库分配按钮-->
                <el-tab-pane label="仓库分配">
                    <div class="tool-wrap" v-if="flag">
                        <el-row class="search-button mt5">
                            <el-button-group>
                                <el-button type="primary" size="small" @click="openAddDialog1">新增</el-button>
                                <el-button type="primary" size="small" @click="deleteProduct">删除</el-button>
                            </el-button-group>
                        </el-row>
                    </div>
                    <el-table :data="tableData" height="250" border style="width: 100%">
                        <el-table-column prop="name" label="仓库名称" width="180"></el-table-column>
                        <el-table-column label="分配模式" width="180">
                            <template slot-scope="scope">
                                <div>
                                    <el-select v-model="scope.row.deliveryType" :disabled="!flag" default-first-option="true">
                                        <el-option :value="1" label="独占比例" select></el-option>
                                        <el-option :value="2" label="共享比例"></el-option>
                                    </el-select>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="percent" label="分配值" width="300">
                            <template slot-scope="scope">
                                <div>
                                    <el-input type="number" max="100" min="1" size="small" v-model="scope.row.percent" placeholder="分配值" :disabled="!flag"></el-input>
                                </div>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
                <!--店铺分配按钮-->
                <el-tab-pane label="店铺分配">
                    <div class="tool-wrap" v-if="flag">
                        <el-row class="search-button">
                            <el-button-group>
                                <el-button type="primary" size="small" @click="openAddDialog2">新增</el-button>
                                <el-button type="primary" size="small" @click="deleteProduct">删除</el-button>
                            </el-button-group>
                        </el-row>
                    </div>

                    <el-table :data="tableData2" height="250" border style="width: 100%">
                        <el-table-column prop="name" label="店铺" width="180"></el-table-column>
                        <el-table-column prop="shopType" label="店铺类型" width="180"></el-table-column>
                        <el-table-column prop="deliveryType" label="分配模式">
                            <template slot-scope="scope">
                                <div>
                                    <el-select v-model="scope.row.deliveryType">
                                        <el-option :value="1" label="独占比例" select></el-option>
                                        <el-option :value="2" label="共享比例"></el-option>
                                    </el-select>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="percent" label="分配值">
                            <template slot-scope="scope">
                                <div>
                                    <el-input size="small" v-model="scope.row.percent" placeholder="分配值"></el-input>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="threshold" label="置零阈值">
                            <template slot-scope="scope">
                                <div>
                                    <el-input size="small" v-model="scope.row.threshold" placeholder="置零阈值"></el-input>
                                </div>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
                <div class="tool-wrap">
                    <div v-if="flag">
                        <el-button-group>
                            <el-button type="primary" size="small" @click="saveVirtualStore('0')">保存</el-button>
                            <el-button type="primary" size="small" @click="saveVirtualStore('1')">保存并启用</el-button>
                            <el-button type="primary" size="small" @click="back">返回</el-button>
                        </el-button-group>
                    </div>
                    <div v-if="!flag">
                        <el-button-group>
                            <el-button type="primary" size="small" @click="back">返回</el-button>
                        </el-button-group>
                    </div>
                </div>
            </el-tabs>
        </el-row>

        <!--新增实体仓库弹窗-->
        <el-dialog title="选择仓库" :visible.sync="dialogTableVisible">
            <div class="search-wrap">
                <el-form :inline="true" :model="searchFilters" :ref="searchFilters" label-position="right" label-width="200px">
                    <el-form-item label="仓库">
                        <el-col :span="12">
                            <el-input v-model="searchFilters.name" placeholder="请输入虚拟仓编码或名称"></el-input>
                        </el-col>
                        <el-col :span="12">
                            <el-button @click="queryStore1">查询</el-button>
                        </el-col>
                    </el-form-item>
                </el-form>
            </div>

            <div class="table-wrap">
                <jic-table :height="350" :operationWidth="200" :tableList="store1" :showDeleteOperation="true" :tableHeaderList="tableHeaderList" :totalSize="totalSize1" :showDetailOperation="true" :showBatchDelete="false" :showOperation="false" :showSelection="true" :showIndex="false" @findPage="queryStore1" @handleSizeChange="handleSizeChange" @handlePageChange="handlePageChange" @selectionChange="selectionChange" ref="jicTable"></jic-table>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addStore1">保 存</el-button>
                <el-button type="primary" @click="dialogTableVisible = false">取 消</el-button>
            </div>
        </el-dialog>

        <!--新增店铺弹窗-->
        <el-dialog title="选择店铺" :visible.sync="dialogTableVisible2">
            <div class="search-wrap">
                <el-form :inline="true" :model="searchFilters" ref="searchFilters" label-position="right" label-width="200px">
                    <el-form-item label="仓库">
                        <el-col :span="12">
                            <el-input v-model="searchFilters.name" placeholder="请输入虚拟仓编码或名称"></el-input>
                        </el-col>
                        <el-col :span="12">
                            <el-button @click="queryStore2">查询</el-button>
                        </el-col>
                    </el-form-item>
                </el-form>
            </div>

            <div class="table-wrap">
                <jic-table :height="350" :operationWidth="200" :tableList="store2" :showDeleteOperation="true" :tableHeaderList="tableHeaderList" :totalSize="totalSize2" :showDetailOperation="true" :showBatchDelete="false" :showOperation="false" :showSelection="true" :showIndex="false" @findPage="queryStore2" @handleSizeChange="handleSizeChange" @handlePageChange="handlePageChange" @selectionChange="selectionChange2" ref="jicTable"></jic-table>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addStore2">保 存</el-button>
                <el-button type="primary" @click="dialogTableVisible2 = false">取 消</el-button>
            </div>
        </el-dialog>
    </div>
</div>
</template>

<script>
//一.导包区
import jicTable from "@/components/jicComponentGallery/jicTable";
import {
    mapState
} from "vuex";
import ThemePicker from "@/components/ThemePicker";
import LangSelector from "@/components/LangSelector";
import VDistpicker from "v-distpicker";
import elTree from "@/views/tree/src/tree.vue";
import {
    param
} from "../../../utils";

//二.数据输出区
export default {
    //2.1 注册组件
    components: {
        jicTable,
        ThemePicker,
        LangSelector,
        VDistpicker,
        elTree
    },

    //2.2 数据初始化区
    data() {
        return {
            pageRequest: {
                pageNum: 1,
                pageSize: 10
            }, // 请求数据的参数
            selections: [], //勾选的仓库信息
            selections2: [], //勾选的店铺信息
            tableHeaderList: [{
                    prop: "code",
                    label: "仓库编码",
                    minWidth: 100,
                    formatter: null
                },
                {
                    prop: "name",
                    label: "仓库名称",
                    minWidth: 100,
                    formatter: null
                }
            ],
            operateDataFormRules: {
                storeId: [{
                    required: true,
                    message: "请选择仓库",
                    trigger: "blur"
                }],
                code: [{
                        required: true,
                        message: "请输入虚拟库编号",
                        trigger: "blur"
                    },
                    {
                        min: 2,
                        max: 8,
                        message: "长度在 2 到 8 个字符",
                        trigger: "blur"
                    },
                    {
                        pattern: /^[^\u4e00-\u9fa5]+$/,
                        message: '虚拟库编码不能包含汉字',
                        trigger: 'blur'
                    },
                    {
                        pattern: /^[A-Za-z0-9\u4e00-\u9fa5]+$/,
                        message: '虚拟库编码不能包含特殊字符',
                        trigger: 'blur'
                    },
                ],
                name: [{
                        required: true,
                        message: "请输入虚拟库名称",
                        trigger: "blur"
                    },
                    {
                        min: 2,
                        max: 8,
                        message: "长度在 2 到 8 个字符",
                        trigger: "blur"
                    }
                ],
                deptId: [{
                    required: true,
                    message: "请选择商家",
                    trigger: "change"
                }]
            },
            dataFormRules: {
                id: [{
                        required: true,
                        message: "请输入",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                code: [{
                        required: true,
                        message: "请输入单据编号",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                product_id: [{
                        required: true,
                        message: "请输入关联商品Id",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                orderId: [{
                        required: true,
                        message: "请输入订单编号",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                balance_id: [{
                        required: true,
                        message: "请输入操作的台账Id",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                operate_id: [{
                        required: true,
                        message: "请输入操作编码",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                operate_desc: [{
                        required: true,
                        message: "请输入操作描述",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                apply_num: [{
                        required: true,
                        message: "请输入申请增减的数量;",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                actual_num: [{
                        required: true,
                        message: "请输入实际增减的数量",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                caculate_type: [{
                        required: true,
                        message: "请输入操作类型(正号为加,负号为减;)",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                create_time: [{
                        required: true,
                        message: "请输入创建时间",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                update_time: [{
                        required: true,
                        message: "请输入修改时间",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                creator: [{
                        required: true,
                        message: "请输入创建人",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                updater: [{
                        required: true,
                        message: "请输入修改人",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                delete_flag: [{
                        required: true,
                        message: "请输入删除标志",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                status: [{
                        required: true,
                        message: "请输入状态(0-待处理;1-已完成)",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                batch_no: [{
                        required: true,
                        message: "请输入批次号",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                remark: [{
                        required: true,
                        message: "请输入备注",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ],
                type: [{
                        required: true,
                        message: "请输入台账类别;1-表示实体仓台账;2-表示虚拟仓台账;",
                        trigger: "blur"
                    },
                    {
                        min: 3,
                        max: 5,
                        message: "长度在 0 到 20 个字符",
                        trigger: "blur"
                    }
                ]
            },
            totalSize1: 1,
            totalSize2: 1,
            currentPage: 5,
            searchFilters: {}, //搜索仓库条件
            formLabelWidth: "120px",
            form: {
                name: "",
                region: "",
                date1: "",
                date2: "",
                delivery: false,
                type: [],
                resource: "",
                desc: ""
            },
            store1: [], //实体仓库数据
            store2: [], //线下店铺数据
            dialogTableVisible: false,
            dialogTableVisible2: false,
            flag: false, //默认是修改页面
            selectedOptionsData1: [], //商家数据下拉框
            storeList: [],
            operates: [], //单据类型数据
            id: this.$route.params.id,
            tableData: [],
            tableData2: [], //线下店铺数据列表
            operateDataForm: {
                storeId: null,
                id: null
            }, //表头基础信息表单

            // 2.2.2 form 表单数据初始化
            dataForm: {
                id: null,
                code: null,
                product_id: null,
                order_id: null,
                balance_id: null,
                operate_id: null,
                operate_desc: null,
                apply_num: null,
                actual_num: null,
                caculate_type: null,
                create_time: null,
                update_time: null,
                creator: null,
                updater: null,
                delete_flag: null,
                status: null,
                batch_no: null,
                remark: null,
                type: null
            },
            flag: true, //默认为编辑
            //trigger 为blur 表示丢失焦点;为change 表示值发生变化;
            //基础表单校验

            //dialogVisible: false, //// 是否显示弹窗内容;
            //editDialogVisible1: false,//// 是否可编辑弹窗内容;
            //editLoading: false,////是否显示加载时动画效果;
        }; //return 完结;
    }, //data()方法 完结;

    //2.3 Vue 方法区
    methods: {
        //2.3.1 公共方法区
        //2.请求列表数据
        getDetail() {
            let flag = this.$route.params.flag;
            if (flag == undefined) {
                this.flag = false;
            } else if (flag == 1) {
                this.flag = true
            }
            let this_ = this;
            //加载商家数据
            this.utils.request.queryMerchantListOther({}, function (res) {
                if (res.code == "0000") {
                    this_.selectedOptionsData1 = res.data;
                }
            });
            if (
                this.$route.params != null &&
                this.$route.params.id != null &&
                this.$route.params.id != "" &&
                this.$route.params.id != "undefined" &&
                this.$route.params.id != "0"
            ) {
                //根据id查询虚拟仓库详情
                let params = {};
                params.id = this.$route.params.id;
                this.utils.request.getMStoreVirtualDetail(params, function (res) {
                    if (res.code === "0000") {
                        console.log(res.data)
                        this_.operateDataForm = res.data;
                        this_.tableData = res.data.warehouses;
                        this_.tableData2 = res.data.shops;
                    } else {
                        this_.$message({
                            message: "操作失败, " + data.msg,
                            type: "error"
                        });
                    }
                });
            } else {
                this.flag = true;

            }
        },

        submitForm: function () {
            this.$refs.dataForm.validate(valid => {
                if (valid) {
                    this.$confirm("确认提交吗？", "提示", {}).then(() => {
                        this.editLoading = true;
                        let params = Object.assign({}, this.dataForm);
                        this.utils.request.saveMStoreOperate(params, this.editInfoBack);
                        this.$router.go(-1);
                    });
                }
            });
        },
        // 7.页面弹窗处理方法
        add() {
            this.dialogVisible = true;
        },

        // 8.关闭弹窗
        handleClose() {
            this.dialogVisible = false;
        },

        getStore() {
            let this_ = this;
            this.utils.request.getMStoreList({}, function (res) {
                if (res.code === "0000") {
                    this_.storeList = res.data;
                } else {
                    this_.$message({
                        message: "操作失败, " + data.msg,
                        type: "error"
                    });
                }
            });
        },
        getOperate() {
            let this_ = this;
            this.utils.request.getOperateList({}, function (res) {
                if (res.code === "0000") {
                    this_.operates = res.data;
                } else {
                    this_.$message({
                        message: "操作失败, " + data.msg,
                        type: "error"
                    });
                }
            });
        },
        queryStore1() {
            this.store1 = [];
            let this_ = this;
            if (this_.searchFilters === undefined || this_.searchFilters === null) {
                this_.searchFilters = {
                    type: 1
                };
            }
            this.searchFilters.type = 1;
            //查询实体仓 type=1
            this.utils.request.findMStorePage(this.searchFilters, function (res) {
                console.log(res);
                let arr = res.data.rows;
                for (let i = 0; i < arr.length; i++) {
                    arr[i].storeId = arr[i].id;
                    arr[i].id = null;
                    this_.store1.push(arr[i]);
                }
                // this_.store1 = res.data.rows;
                this_.totalSize1 = Number(res.data.total);
            });
        },
        queryStore2() {
            let this_ = this;
            if (this_.searchFilters === undefined || this_.searchFilters === null) {
                this_.searchFilters = {
                    type: 2
                };
            }
            this.searchFilters.type = 2;
            //查询实体仓 type=1
            this.utils.request.findMStorePage(this_.searchFilters, function (res) {
                let arr = res.data.rows;
                for (let i = 0; i < arr.length; i++) {
                    arr[i].storeId = arr[i].id;
                    arr[i].id = null;
                    this_.store2.push(arr[i]);
                }
                // this_.store2 = res.data.rows;
                this_.totalSize2 = Number(res.data.total);
            });
        },
        deleteProduct() {
            alert("删除商品");
        },
        importProduct() {
            alert("导入商品");
        },
        selectMerchant(id) {
            //根据选择仓库id加载对应的商家
            console.log(id);
        },
        //保存表头
        addOperate() {
            let this_ = this;
            this.$refs.operateDataForm.validate(valid => {
                if (valid) {
                    this.$confirm("确认提交吗？", "提示", {}).then(() => {
                        let params = Object.assign({}, this.operateDataForm);
                        this.utils.request.saveOrUpdateMStoreOperate(params, function (res) {
                            if (res.data != "0") {
                                this_.$message({
                                    message: "保存单据信息成功",
                                    type: "success"
                                });
                                this_.operateDataForm.id = res.data;
                            }
                        });
                    });
                }
            });
        },
        //返回上一页;
        back() {
            this.$router.push("../../Pages/Store/MStoreVirtualList");
        },
        editInfoBack() {
            //跟新当前页面operate表头信息
            this.getDetail();
        },
        handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
        },
        // 仓库选中列表中的选项触发
        selectionChange(selections) {
            this.selections = selections.selections;
        },
        // 店铺选中列表中的选项触发
        selectionChange2(selections) {
            this.selections2 = selections.selections;
        },
        handlePageChange(params) {
            this.pageRequest.pageNum = params.number;
            this.findPage();
        },
        addStore1() {
            this.dialogTableVisible = false;
            //把选中的实体仓库数据加入到实体仓库列表中
            for (let i = 0; i < this.selections.length; i++) {
                this.tableData.push(this.selections[i]);
            }
        },
        addStore2() {
            this.dialogTableVisible2 = false;
            //把选中的实体仓库数据加入到实体仓库列表中
            for (let i = 0; i < this.selections.length; i++) {
                this.tableData2.push(this.selections2[i]);
            }
        },
        //打开新增仓库分配弹窗
        openAddDialog1() {
            let this_ = this;
            //判断是否保存单据
            this.dialogTableVisible = true;
            //加载实体仓库type=1的仓库
            this.queryStore1();
        },

        //打开新增实体店铺弹窗
        openAddDialog2() {
            let this_ = this;
            this.dialogTableVisible2 = true;
            //加载实体仓库type=1的仓库
            this.queryStore2();
        },
        //保存虚拟仓库
        saveVirtualStore(type) {
            //type=1 保存   type=2保存并启用
            let this_ = this;
            let params = {};
            params.status = type;
            //添加虚拟仓库信息
            params.id = this.operateDataForm.id;
            params.code = this.operateDataForm.code;
            params.name = this.operateDataForm.name;
            params.deptId = this.operateDataForm.deptId;
            //仓库分配列表信息
            params.warehouses = this.tableData;
            if (params.warehouses.length > 0) {
                this.$refs.operateDataForm.validate(valid => {
                    if (valid) {
                        this.$confirm("确认提交吗？", "提示", {}).then(() => {
                            this.utils.request.saveOrUpdateMStoreVirtual(params, function (res) {
                                if (res.data != "0") {
                                    this_.$message({
                                        message: "保存单据信息成功",
                                        type: "success"
                                    });
                                    this_.back()
                                }
                            });
                        });
                    }
                });
                //店铺分配列表信息
                params.shops = this.tableData2;
                console.log(params);
                //保存虚拟仓库信息

            } else {
                alert("请选择仓库");
            }
        }

        //==========2.3.1 JavaScript 自定义方法区==========
    },

    //1.初始化页面调用方法(dom元素绑定后再执行初始化数据操作)
    mounted() {
        this.getDetail();
        //加载仓库列表
        this.getStore();
        this.getOperate();
    },
    watch: {
        dialogTableVisible(newVal) {
            if (!newVal) {
                this.searchFilters.name = '';
            }
        }
    }
};
</script>

<style lang="scss" scoped>
/* ele组件样式重置 */
.common-content {
    padding: 10px;
    box-sizing: border-box;

    .search-wrap /deep/ {
        .el-form-item__label {
            height: 32px;
            line-height: 32px;
        }

        .el-form-item__content {
            height: 32px;
            line-height: 32px;
            width: 150px;
        }

        .el-input--mini .el-input__inner {
            height: 32px;
            line-height: 32px;
        }

        .el-date-editor.el-input,
        .el-date-editor.el-input__inner {
            width: 150px;
        }
    }

    /* 多日期样式重置 */
    .el-dater /deep/ .el-form-item__content {
        width: 330px;
    }

    /* 通用工具部分样式 */
    .tool-wrap {
        width: 100%;
        height: auto;
        position: relative;
        overflow: hidden;

        .left-area {
            float: left;
            width: 50%;
            text-align: left;

            button {
                margin-right: 15px;
                border-radius: 5px;
            }
        }

        .right-area {
            float: right;
            width: 50%;
            text-align: right;
        }
    }

    /* 表格部分样式 */
    .table-wrap {
        width: 100%;
        max-height: 600px;
        margin-top: 20px;
    }

    /* 弹窗样式 */
    .dialog-wrap /deep/ .el-dialog__footer {
        text-align: center !important;
    }
}

.s-button {
    text-align: right;
    width: 100%;
    justify-content: flex-end;

    // border-bottom: 1px solid #dbdbdb;
    /deep/ .el-form-item {
        margin-bottom: 5px !important;
    }
}

.mt5 {
    margin-top: 5px;
}

.search-input {
    padding-top: 15px !important;
}
</style>
